import React from "react";
import store from '../../../store'
import { updateContent } from '../../../store/actionCreators'

type P = {}

type S = {
    content: string;
}

export default class CustomC extends React.Component<P, S> {
    constructor(props: P) {
        super(props)
        this.state = store.getState()
        store.subscribe(this.storeChange)
    }
    storeChange = () => {
        console.log('store change -- CustomC')
        this.setState(store.getState())
    }
    inputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
        const value = e.target.value
        store.dispatch(store.dispatch(updateContent(value, 'C')))
    }
    render() {
        const { content } = this.state
        return (
            <div>
                <p>CustomC - store: {content}</p>
                <input type="text" value={this.state.content} onChange={this.inputChange} />
            </div>
        )
    }
}